Работа с датами в JavaScript - важная часть разработки веб-приложений. В данной статье мы рассмотрим основные функции языка, такие как создание объектов даты, получение текущей даты и времени, форматирование значений и манипуляции с датами. Вы получите полное представление о работе с датами в JavaScript и сможете применить эти знания в своих проектах.

Базовые операции с датами

Создать дату в JavaScript можно с помощью конструктора Date(), который при вызове без параметров (const date = new Date()) вернет дату и время вызова в формате YYYY-MM-DDTHH:mm:ss.sssZ где YYYY-MM-DD - год, месяц и день, T - разделитель между датой и временем, HH:mm:ss.sss - часы, минут, секунды и миллисекунды, а Z - настройки временной зоны. Даты в JavaScript представлены в виде количества миллисекунд, прошедших с 1 января 1970 года по UTC поэтому новую дату можно так же создать с помощью метода .now() глобального объекта Date, который вернет количество миллисекунд до вызова.

const date1 = new Date();
//2023-08-29T11:30:31.224Z

const date2 = Date.now();
//1693308631228

Поскольку даты содержат точное количество миллисекунд, прошедших с 1 января 1970 года по UTC разницу между ними можно использовать для замера времени между началом и окончанием выполнения какой-либо операции. Для таких целей лучше использовать метод Date.now() вместо конструктора т.к. он гораздо быстрее потому что не создает при вызове промежуточных объектов и возвращает сразу количество миллисекунд, что может быть важно при проведении большого количества замеров подряд.

const start = Date.now();
(function someCalcs() {
  //какие-то сложные вычисления
})();
console.log(`Время выполнения: ${Date.now() - start}мс`);

Что бы задать конкретную дату нужно передать ее в конструктор в одном из следующих форматов:

• Указать год, месяц, день и т.д. цифрами через запятую
• Строка вида “ YYYY-MM-DDTHH:mm:ss.sssZ” или 'December 31, 2023 23:59:59’ фактически такой способ является неявным вызовом метода Date.parse()
• Другой объект даты
• Количество миллисекунд, прошедших с 1 января 1970 года по UTC

При указании даты строкой или перечислением цифр не обязательно указывать точное до мс значение. Если не передать количество мс, секунд, минут или часов - они будут автоматически установлены на 0, дни на 1, месяца на 0 (нумерация месяцев начинается с 0). При этом год нужно передавать полностью, а не последние 2 цифры.

Внести изменения в уже существующий объект даты, можно с помощью методов, которые имеют название .set<нужное значение> как .setDate() для дней (.getDay() вернет день недели числом от 0 до 6), .setFullYear() для года (.setYear() был удален из стандарта т.к. мог принимать не полное значение года) или .setHours() для часов. Если указать при объявлении даты или передать в один из таких методов несуществующее значение, например 20-й месяц или 25-й час - дата автоматически отформатируется и вместо 25 часов добавит к значений дней единицу, а часы установит на 1.

Важно помнить что Date ссылочный тип данных и два объекта, содержащие одинаковые даты не будут равны друг другу при любом типе сравнения.

const newYear1 = new Date(2023, 11, 31, 23, 59, 59, 999);
//2023-12-31T18:59:59.999Z
const newYear2 = new Date("2023-12-31T18:59:59.999");
//2023-12-31T13:59:59.999Z
const newYear3 = new Date(1704031199999); //передаем количество мс
//2023-12-31T13:59:59.999Z
console.log(newYear1 === newYear2); //false
const ms = newYear1 - newYear2; //при этом разница в ms = 0
//0

newYear1.setDate(32); //устанавливаем несуществующий день в месяце
console.log(newYear1);
//2024-01-01T18:59:59.999Z дата подстроится под заданные параметры

По аналогии с методами для изменения значений даты, существуют методы для получения части значений. Такие методы имеют название .get<нужное значение> или .getUTC<нужное значение> для получения получения значений по Гринвичу.

const date = new Date();
//дата и время на момент вызова
date.getHours();
//значение часов в месте вызова 
date.getUTCHours()
//значение часов по Гринвичу

Работа с форматированием дат

В JavaScript доступны методы для вывода дат в виде строки разных форматов:

• .toString() - не принимает параметров и возвращает строку в виде: день недели (Mon), первые три буквы месяца (Aug), день (28), год (2023), время без мс (12:45:30), часовой пояс относительно UTC (GMT-0700) и название часового пояса в скобках (Pacific Daylight Time).
• .toDateString - аналогичен .toString() , но возвращает только дату без времени.
• .toTimeString() - аналогичен .toString(), но возвращает только время без даты.
• .toUTCString() - аналогичен .toString(), но возвращает дату по Гринвичу.
• .toLocalString() - принимает настройки локализации (язык и название страны) и опции (например формат отображения часов в виде 24 или am/pm) и возвращает строку в принятом в указанной стране и языке формате.
• .toLocalDateString() - аналогичен .toLocalString(), но возвращает только дату без времени.
• .toLocalTimeString() - аналогичен .toLocalString(), но возвращает только время без даты.

const date = new Date(); //стандартное форматирование
//2023-08-29T14:47:07.820Z
console.log(date.toString()); //в строку
//Tue Aug 29 2023 19:47:07 GMT+0500 (Yekaterinburg Standard Time)
console.log(date.toDateString()); //только дата
//Tue Aug 29 2023
console.log(date.toTimeString()); //только время
//19:47:07 GMT+0500 (Yekaterinburg Standard Time)
console.log(date.toUTCString()); //по Гринвичу
//Tue, 29 Aug 2023 14:47:07 GMT
console.log(date.toLocaleString("en-US")); //англичйский США
//8/29/2023, 7:47:07 PM
console.log(date.toLocaleString("en-US", { hour12: false })); //то же но 24 часовой формат
//8/29/2023, 19:47:07
console.log(date.toLocaleDateString("de-DE")); //только дата немецкий Германия
//29.8.2023
console.log(date.toLocaleTimeString("ko-KR")); //только время корейский Корея
//오후 7:47:07

Date можно сериализовать в формат JSON с помощью метода .toJSON() . Конструктор конечно же прекрасно распарсит такую строку.

const toJSON = new Date().toJSON();
//2023-08-29T14:51:52.158Z
const toDate = new Date(toJSON);
//2023-08-29T14:51:52.158Z
console.log(typeof toJSON); //string
console.log(typeof toDate);//object

Заключение

Понимание концепций работы с датами и навык их применения позволят вам создавать более динамичные и функциональные веб-приложения на JavaScript. Не забывайте продолжать изучать и практиковать использование дат в своих проектах, чтобы стать опытным и уверенным разработчиком. Надеюсь что данная статья была полезна для понимания столь важной темы, а если вы хотите изучить основы языка или детально погрузиться в устройство JavaScript я подготовил подробные курсы.